function 在 JavaScript 是個讓人又愛又恨的東西,也可以說是 JavaScript 整個語言中最讓人驚艷的部份,也讓我們發現許多好玩的使用方式。
JavaScript 的神奇方法 function - node.js day 9
內文
function 在 JavaScript 是個讓人又愛又恨的東西,也可以說是 JavaScript 整個語言中最讓人驚艷的部份,也讓我們發現許多好玩的使用方式。
當然先從 function 的宣告開始講起,
function test () {
// do something
console.log('run test');
}
前面的使用方式,建立了一個 test 方法,這是 function 的宣告方式,而另外一種,
var test = function () {
// do something
console.log('run test');
};
在上面,又看到另外一種不一樣的宣告方式,這種方式比較像是宣告一個變數,然後給予一個 function type,即為宣告一個匿名函式,其中一個最大的差異就是,前面的宣告最後的結尾沒有給予分號 (;)。
但是在第二種宣告方式,使用變數宣告方式的型態,最後會以分號為結尾。
這並不是強制的作法,但是建議最好這麼做,讓你的每個宣告,都有一個適當的結尾。
有宣告就必須要執行,一個 function 執行的方法很簡單。
test();
方法名稱,加上括號,再給予一個結尾符號 ;,特別是 ()對於 function 型態來說,就是執行。
上面講到兩種宣告方式,差異到底在哪裡呢?主要的部份是,使用點,從實際例子來解說,
test();
function test1() {
console.log('run test 1');
}
實際將上面的程式碼存成檔案,使用 node.js 執行之後會發現, test 方法是可以被執行的,同樣的使用另外一種宣告方式呢?
test();
var test = function () {
console.log('run test 1');
}
參數傳遞
使用發法,當然會希望可以傳遞參數進去,最簡單的傳遞參數方法,
function test(x, y) {
console.log('param 1: ' + x + ', param 2: ' + y);
}
test(1,2);
//print: param 1: 1, param 2: 2
另外一種傳遞參數,則是使用 arguments 這個在 function 才會有的特別變數。
[這邊我們先不探討 arguments 這個全域變數怎麼出現。]
arguments 會在 function 有傳遞參數時候,會以 arguments[0], arguments[1], arguments[2] … 方式存在,換句話說,也就是 arguments 會是以陣列的方式存在。
console.log(arguments);
//print: Error, arguments not defined.
function test(x, y) {
console.log(arguments);
}
test(1,2);
//print: [1, 2]
由上面結果我們可以證明 arguments 在 function 還沒有告以前,是不會有這個變數存在。
另外也證明了, arguments 在 function 中,確實以陣例的方式存在,同時會將我們傳入 function 的參數,以陣列的方式傳入。
所以可以得知,如果今天 function 中無法預測使用者會傳入幾個參數的時候,就是使用 arguments 的最佳時機
function test() {
console.log('print params :');
console.log(arguments.join(' ; '));
}
test(1,2);
//print: [1, 2]
test(4, 5, 'abc');
//print: [4, 5, 'abc']
回傳值
使用一個 function 是希望可以將結果,回傳到 function 的執行本體,簡單的使用方式就是
function test (x, y) {
retun x + y;
}
console.log(test(1, 10));
//print: 11
當最後執行 test 的時候,當 test 執行結束,會回傳一個數值,或許是回傳一個物件等,都可以用 return 這個 const 來執行回傳,讓呼叫的本體可以取嘚回傳值。
後記
function 很多時候,是個讓人在開發 JavaScript 十分模糊的東西,讓人搞不清楚他正在做什麼事情,也不知道如何去正確告他。當然這也是 JavaScript 可愛有趣之觸,可以讓開發者進行千變萬化的方式來宣告、執行不同方法。
明天將會繼續延續 function 的話題,跟大家講解什麼叫做 closure ,怎麼樣的情況稱為 closure,通常開發上會有哪些狀況會使用到 closure ,請大家一起期待。